<template>
  <el-form ref="refFrom" label-position="top" class="padding">
    <el-row>
      <el-col :span="6">
        <el-form-item label="活动类型">
          {{marchType(currentItem.coupon.couponType,type)}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="活动名称">
          {{currentItem.activityName}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="活动时间起止"> {{ currentItem.startTime }}-{{ currentItem.endTime }} </el-form-item>
      </el-col>
      <el-col :span="3">
        <el-form-item label="可用对象">
          {{marchType(currentItem.scope,scope)}}
        </el-form-item>
      </el-col>
      <el-col :span="3">
        <el-form-item label="活动状态">
          <el-tag v-if="currentItem.status == 3" type="info">已结束</el-tag>
          <el-tag v-else-if="currentItem.status == 1" type="warning">未开始</el-tag>
          <el-tag v-else-if="currentItem.status == 2" type="primary">进行中</el-tag>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="6">
        <el-form-item label="可用范围">
          {{marchType(currentItem.orderType,orderType)}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="发放比例">
          {{currentItem.coupon.distributionRatio}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="券有效期时间起止"> {{currentItem.coupon.validFrom}}-{{currentItem.coupon.validTo}} </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="活动链接">
          {{currentItem.qrCode}}
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="6" v-if="currentItem.activityType == '2'">
        <el-form-item label="积分比例">
          {{currentItem.points.exchangeRate}}
        </el-form-item>
      </el-col>
      <el-col :span="6" v-else-if="currentItem.coupon.couponType == '1'">
        <el-form-item label="优惠金额(元)" v-if="currentItem.coupon.optionsBo.cash.cashType=='1'">
          {{currentItem.coupon.optionsBo.cash.denomination}}
        </el-form-item>
        <el-form-item label="优惠金额(元)" v-else-if="currentItem.coupon.optionsBo.cash.cashType=='2'">
          {{currentItem.coupon.optionsBo.cash.randomFloorAmount}}-{{currentItem.coupon.optionsBo.cash.randomRoofAmount}}
        </el-form-item>
      </el-col>
      <el-col :span="6" v-else-if="currentItem.coupon.couponType == '2'">
        <el-form-item label="满减条件">
          <span v-for="(discount,index) in currentItem.coupon.optionsBo.discounts" :key="index">
            &nbsp;{{index>0?"/":""}} 满{{discount.minOrderAmount}}元减{{discount.discountAmount}}元
          </span>
        </el-form-item>
      </el-col>
      <el-col :span="6" v-else-if="currentItem.coupon.couponType == '3'">
        <el-form-item label="体验时长（分钟）">
          {{currentItem.coupon.optionsBo.experience.durationMs}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="发放总张数">
          {{currentItem.coupon.totalQuantity}}
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="同账号可领取张数">{{currentItem.coupon.claimCount}} </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="实际发放比例"> {{currentItem.coupon.distributionRatio}}% </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="6">
        <el-form-item label="参与人次"> </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="核销比例"> 未知 </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="核销人次">未知 </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="关联订单金额合计(元)">
          {{currentItem.orderAmount}}
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>

<script lang="ts">
export default {
  props: {
    data: {}
  },
  data() {
    return {
      currentItem: {},
      status: [
        { label: '未开始', value: 1 },
        { label: '进行中', value: 2 },
        { label: '已结束', value: 3 }
      ],
      type: [
        { label: '优惠', value: '1' },
        { label: '积分', value: '0' },
        { label: '满减', value: '2' },
        { label: '体验', value: '3' }
      ],
      couponType: [
        { label: '定额', value: '1' },
        { label: '随机', value: '2' }
      ],
      scope: [
        { label: '全局', value: 1 },
        { label: '区域', value: 2 },
        { label: '酒店', value: 3 }
      ],
      orderType: [
        { label: '全局', value: '1' },
        { label: '吸氧', value: '2' },
        { label: '充灌', value: '3' }
      ]
    };
  },
  created() {
    this.init();
  },
  methods: {
    init(data) {
      if (data == null) data = this.data;

      if (data.activityType == '2') data.coupon.couponType = '0';
      this.currentItem = JSON.parse(JSON.stringify(data));
      console.log(this.currentItem);
    },
    /**
     * 匹配结果
     */
    marchType(value, types) {
      for (let i = 0; i < types.length; i++) {
        let type = types[i];
        if (type.value == value) return type.label;
      }
    }
  }
};
</script>

<style scoped>
.padding {
  padding: 0px;
}
</style>
